<template>
	<view class="content">

		<view class="logo shake">
			<image class="logo-image" src="/static/Rubik-s.png"></image>
		</view>

		<view class="item-bg" v-for="(item, index) in list" :key="index" @click="handleItem(index)">
			<image class="item-bg-image" :src="item.image"></image>

			<view class="left">
				<view class="title">{{item.title}}</view>
				<view class="desc">{{item.describe}}</view>
			</view>

			<image class="dot-image" src="/static/arrow-right.png"></image>
		</view>


		<view class="tip">
			<view>✓ 分年纪学习内容，循序渐进</view>
			<view>✓ 三科融合，全面发展</view>
		</view>
	</view>
</template>

<script setup>
	import {
		onShareAppMessage
	} from '@dcloudio/uni-app'
	
	onShareAppMessage((res)=>{
		if (res.from === 'button') { // 来自页面内分享按钮
			console.log(res.target)
		}
		return {
			title: "趣味学习挑战，等你来战",
			path: '/pages/baby/baby'
		}
	})


	// 趣味学习首页
	const list = [{
		image: "https://env-00jxty8ur34a.normal.cloudstatic.cn/static/baby-bg1.png",
		title: "识字消消乐",
		describe: "学习汉字，提高生字词能力"
	}, {
		image: "https://env-00jxty8ur34a.normal.cloudstatic.cn/static/baby-bg2.png",
		title: "口算消消乐",
		describe: "口算练习，培养计算能力"
	}, {
		image: "https://env-00jxty8ur34a.normal.cloudstatic.cn/static/baby-bg3.png",
		title: "单词消消乐",
		describe: "字母单词，开启英语之门"
	}]

	function handleItem(index) {
		switch (index) {
			case 0:
				uni.navigateTo({
					url: "/pages/baby/chinese/index"
				})
				break;
			case 1:
				uni.navigateTo({
					url: "/pages/baby/math/index"
				})
				break;
			case 2:
				uni.navigateTo({
					url: "/pages/baby/english/index"
				})
				break;
			default:
				uni.showToast({
					title: '敬请期待！',
					icon: "none"
				});
				break;
		}
	}
</script>

<style>
	@import "baby.css"
</style>